<template>
	<view class="container">
		<view class="box flex-ac">
			<view class="hd">异常反馈</view>
			<view class="bd">
				<textarea v-model="text" placeholder="请输入" />
			</view>
		</view>
		<view class="foot">
			<view class="btnBox flex-ac">
				<view class="btn-1 middle" @click="submit">确定</view>
			</view>
			<x-botSpace></x-botSpace>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: '',
				text: ''
			}
		},
		onLoad(opt) {
			if(opt) console.log('opt:', opt)
			this.id = opt.id
		},
		methods: {
			submit() {
				if(!this.text) return uni.showToast({title: '请输入异常内容', icon: 'none'})
				this.$Net.post('/order/abnormal',{
					content: this.text,
					id: this.id
				}).then(res=>{
					this.$Toast.messageIcon('反馈成功')
					setTimeout(()=>{
						this.$Jump.Back(1)
					},1000)
				})
			}
		}
	}
</script>

<style lang="scss">
	page{ background-color: #f9f9f9; }
</style>

<style lang="scss" scoped>
	// @import './style.scss';
	.container{
		width: 100%;
	}
	.box{
		// width: 100%;
		padding: 30rpx;
		align-items: flex-start;
		box-sizing: border-box;
		.hd{
			flex-shrink: 0;
			margin-right: 14rpx;
		}
		.bd{
			flex: 1;
			height: 400rpx;
			border: 1rpx solid #bbbbbb;
			padding: 20rpx;
			font-size: 28rpx;
			color: #333333;
			textarea{
				width: 100%;
			}
		}
	}
	.foot {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 30rpx;
	
		.btnBox {
			width: 100%;
	
			.btn-1 {
				flex: 1;
				height: 90rpx;
				background: #1684FC;
				border-radius: 10rpx;
				color: #ffffff;
				font-size: 34rpx;
			}
	
			.btn-2 {
				flex: 1;
				height: 90rpx;
				border: 1px solid #1684FC;
				border-radius: 10rpx;
				color: #1684FC;
				font-size: 34rpx;
			}
		}
	}
</style>
